<!DOCTYPE html>
<html lang="en">


<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>小米商城</title>
  <link rel="stylesheet" href="../CSS/style.css">
  <link rel="stylesheet" href="//at.alicdn.com/t/c/font_3744617_50pdjgydfbv.css">
  <link rel="stylesheet" href="../CSS/index.css">
  <style>

  </style>
</head>

<body>
  <!--header 开始  -->
  <header id="header">
    <div class="container">
      <ul class="left">
        <li><a href="">小米官网</a></li>
        <li><a href="">小米商城</a></li>
        <li><a href="">MIUI</a></li>
        <li><a href="">loT</a></li>
        <li><a href="">云服务</a></li>
        <li><a href="">天星数科</a></li>
        <li><a href="">有品</a></li>
        <li><a href="">小爱开放平台</a></li>
        <li><a href="">企业团购</a></li>
        <li><a href="">资质证照</a></li>
        <li><a href="">协议规则</a></li>
        <li><a href="">下载app</a></li>
        <li><a href="">Select Location</a></li>
      </ul>
      <ul class="right">
        <li>登陆</li>
        <li>注册</li>
        <li class="no-gap">消息通知</li>
        <li class="cart"><i class="iconfont icon-cart"></i><a href=""> 购物车 (0)</a></li>
      </ul>
    </div>
  </header>
  <!--header 结束  -->

  <!--nav开始  -->
  <nav id="nav" class="flex container align-itemscenter">
    <a href="index.html"><img class="logo" src="../images/8d6f642af31c8dbbe3fb37896ba392e.png" alt=""></a>

    <!-- 导航 -->
    <ul class="flex">
      <li><a href="">手机1</a></li>
      <li><a href="">手机2</a></li>
      <li><a href="">手机3</a></li>
      <li><a href="">手机4</a></li>
      <li><a href="">手机5</a></li>
      <li><a href="">手机6</a></li>
    </ul>
    <!-- 搜索框 -->
    <div class="search">
      <input type="text" placeholder="Search...." name="" id="">
      <button><i class=" iconfont icon-search"></i></button>

    </div>
  </nav>
  <!--nav结束  -->
  <!-- banner 开始 -->
  <div id="banner" class="container">
    <ul>
      <li><a href="">手机</a><i class="iconfont icon-arrow-right"></i></li>
      <li><a href="">家电</a><i class="iconfont icon-arrow-right"></i></li>
      <li><a href="">手机</a><i class="iconfont icon-arrow-right"></i></li>
      <li><a href="">家电</a><i class="iconfont icon-arrow-right"></i></li>
      <li><a href="">电视</a><i class="iconfont icon-arrow-right"></i></li>
      <li><a href="">手机</a><i class="iconfont icon-arrow-right"></i></li>
      <li><a href="">电视</a><i class="iconfont icon-arrow-right"></i></li>
      <li><a href="">电脑</a><i class="iconfont icon-arrow-right"></i></li>
      <li><a href="">平板</a><i class="iconfont icon-arrow-right"></i></li>
      <li><a href="">耳机</a><i class="iconfont icon-arrow-right"></i></li>
    </ul>
    </div>
    <!-- banner 结束 -->
    <div class="hot-productionns container">
      <ul>
        <li><i class="iconfont icon-arrow-right"></i><span>保障服务</span></li>
        <li><i class="iconfont icon-arrow-right"></i><span>保障服务</span></li>
        <li><i class="iconfont icon-arrow-right"></i><span>保障服务</span></li>
        <li><i class="iconfont icon-arrow-right"></i><span>保障服务</span></li>
        <li><i class="iconfont icon-arrow-right"></i><span>保障服务</span></li>
        <li><i class="iconfont icon-arrow-right"></i><span>保障服务</span></li>
      </ul>
      <ul class="flex img-list">
      <li><a href="#"><img src="../images/1.jpg" alt=""></a></li>
      <li><a href="#"><img src="../images/2.jpg" alt=""></a></li>
      <li><a href="#"><img src="../images/3.jpg" alt=""></a></li>
      </ul>
  
    </div>
  
</body>

</html>